<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>查询结果</title>
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/bootstrap.min.css" />
<script src="${pageContext.request.contextPath}/js/jquery-3.2.1.min.js"
	type="text/javascript" charset="utf-8"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"
	type="text/javascript" charset="utf-8"></script>
</head>
<body>

	<jsp:include page="header.jsp"></jsp:include>

	<jsp:include page="navigation.jsp"></jsp:include>

	<!-- 商品展示区域 -->
	<div class="container-fluid">
		<!-- 商品分类 -->
		<jsp:include page="category-list.jsp"></jsp:include>

		<div class="col-xs-1"></div>

		<div class="col-xs-8"
			style="height: 500px; border: 1px solid gray; border-radius: 8px;">
			<h2>商品列表</h2>
			<div class="container-fluid">
				<div class="row">
					<c:forEach items="${pageInfo.list}" var="product">
						<div class="col-xs-1">
							<img src="${pageContext.request.contextPath}/img/background.jpg"
								style="width: 60px; height: 60px; margin-top: 10px;">
						</div>
						<div class="col-xs-5" style="height: 60px; margin-top: 10px;">
							<a href="${pageContext.request.contextPath}/product/user-findById.do?productId=${product.productId}"
								style="color: #666666; font-size: 10px">${product.productName}&nbsp;&nbsp;${product.productDesc}</a>
							<span class="col-xs-offset-9"
								style="color: #E43947; font-size: 10px">${product.price}</span>
						</div>
					</c:forEach>

				</div>
				<!-- 分页 -->
				<div class="col-md-offset-5" style="margin-top:40px;">
					<nav aria-label="Page navigation">
						<ul class="pagination">
							<c:if test="${pageInfo.pageNum==1}">
								<li class="disabled"><a href="#" aria-label="Previous">
										<span aria-hidden="true">&laquo;</span>
								</a></li>
							</c:if>

							<c:if test="${pageInfo.pageNum!=1}">
								<li><a
									href="${pageContext.request.contextPath}/product/user-search.do?pageNum=${pageInfo.pageNum-1}&condition=${condition}"
									aria-label="Previous"> <span aria-hidden="true">&laquo;</span>
								</a></li>
							</c:if>

							<c:forEach begin="1" end="${pageInfo.pages}" var="i">
								<c:if test="${pageInfo.pageNum!=i}">
									<li><a
										href="${pageContext.request.contextPath}/product/user-search.do?pageNum=${i}&condition=${condition}">${i}</a></li>
								</c:if>
								<c:if test="${pageInfo.pageNum==i}">
									<li class="active"><a
										href="${pageContext.request.contextPath}/product/user-search.do?pageNum=${i}&condition=${condition}">${i}</a></li>
								</c:if>
							</c:forEach>

							<c:if test="${pageInfo.pageNum==pageInfo.pages}">
								<li class="disabled"><a aria-label="Next"> <span
										aria-hidden="true">&raquo;</span>
								</a></li>
							</c:if>

							<c:if test="${pageInfo.total!=pageInfo.pages}">
								<li><a
									href="${pageContext.request.contextPath}/product/user-search.do?pageNum=${pageInfo.pageNum+1}&condition=${condition}"
									aria-label="Next"> <span aria-hidden="true">&raquo;</span>
								</a></li>
							</c:if>
						</ul>
					</nav>
				</div>
			</div>
		</div>
	</div>
</body>
</html>
